<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp"%>
<%@include file="../common/jscss.jsp"%>


<style type="text/css">
    .l-table-edit {font-size: 12px;margin: auto;}
 	.l-table-edit-td{ padding:4px;}
    .l-button-submit,.l-button-test{width:80px; float:left; margin-left:10px; padding-bottom:2px;}
    .l-verify-tip{ left:230px; top:120px;}
    .error{color:red}
</style>

<table cellpadding="0" cellspacing="0" class="l-table-edit">
	<tr>
			<td align="right" class="l-table-edit-td">
				滚动图片1:
			</td>
			<td align="left" class="l-table-edit-td">
				<form id="upload_img_form1" enctype="multipart/form-data" method="post" action="/misc/hotel/uploadImg.htm">
					<input type="file" onchange="uploadImg(this,1);return false;" style="width: 200px;"  title="支持jpg、jpeg、gif、png格式，文件小于2M" name="imagef1" id="imagef1"/>
					<a href="javascript:;" target="_blank" onclick="previewImg('image1');">预览</a>
				</form>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				滚动图片2:
			</td>
			<td align="left" class="l-table-edit-td">
				<form id="upload_img_form2" enctype="multipart/form-data" method="post" action="/misc/hotel/uploadImg.htm">
					<input type="file" onchange="uploadImg(this,2);return false;" style="width: 200px;"  title="支持jpg、jpeg、gif、png格式，文件小于2M" name="imagef2" id="imagef2"/>
					<a href="javascript:;" target="_blank" onclick="previewImg('image2');">预览</a>
				</form>
			</td>
			<td align="left"></td>
		</tr>
		
		<tr>
			<td align="right" class="l-table-edit-td">
				滚动图片3:
			</td>
			<td align="left" class="l-table-edit-td">
				<form id="upload_img_form3" enctype="multipart/form-data" method="post" action="/misc/hotel/uploadImg.htm">
					<input type="file" onchange="uploadImg(this,3);return false;" style="width: 200px;"  title="支持jpg、jpeg、gif、png格式，文件小于2M" name="imagef3" id="imagef3"/>
					<a href="javascript:;" target="_blank" onclick="previewImg('image3');">预览</a>
				</form>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				滚动图片4:
			</td>
			<td align="left" class="l-table-edit-td">
				<form id="upload_img_form4" enctype="multipart/form-data" method="post" action="/misc/hotel/uploadImg.htm">
					<input type="file" onchange="uploadImg(this,4);return false;" style="width: 200px;"  title="支持jpg、jpeg、gif、png格式，文件小于2M" name="imagef4" id="imagef4"/>
					<a href="javascript:;" target="_blank" onclick="previewImg('image4');">预览</a>
				</form>
			</td>
			<td align="left"></td>
		</tr>
		
		<tr>
			<td align="right" class="l-table-edit-td">
				滚动图片5:
			</td>
			<td align="left" class="l-table-edit-td">
				<form id="upload_img_form5" enctype="multipart/form-data" method="post" action="/misc/hotel/uploadImg.htm">
					<input type="file" onchange="uploadImg(this,5);return false;" style="width: 200px;"  title="支持jpg、jpeg、gif、png格式，文件小于2M" name="imagef5" id="imagef5"/>
					<a href="javascript:;" target="_blank" onclick="previewImg('image5');">预览</a>
				</form>
			</td>
			<td align="left"></td>
			
		</tr>
</table>
<form name="saveForm" method="post" action="/misc/hotel/saveHotel.htm" id="saveForm">
	<input name="id" type="hidden" id="id" value="${hotel.id}" />
	<input name="image1" type="hidden" id="image1" value="${hotel.image1}"/>
	<input name="image2" type="hidden" id="image2" value="${hotel.image2}"/>
	<input name="image3" type="hidden" id="image3" value="${hotel.image3}"/>
	<input name="image4" type="hidden" id="image4" value="${hotel.image4}"/>
	<input name="image5" type="hidden" id="image5" value="${hotel.image5}"/>
	<input type="hidden" name="provinceName" id="provinceName"/>
	<input type="hidden" name="cityName" id="cityName"/>
	<table cellpadding="0" cellspacing="0" class="l-table-edit">
		<tr>
			<td align="right" class="l-table-edit-td">
				名字:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="name" type="text" id="name" value="${hotel.name}" ltype="text" validate="{required:true,minlength:1,maxlength:50}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				开业时间:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="opened" type="text" id="opened" value="${hotel.opened}" ltype="text" validate="{required:true,maxlength:50}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td" valign="top">
				酒店类型:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="hotelType" type="text" id="hotelType" value="${hotel.hotelType}" ltype="text" validate="{required:true,maxlength:20}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td" valign="top">
				支付方式:
			</td>
			<td align="left" class="l-table-edit-td">
				<input id="payFrom1" type="radio" name="payFrom" value="01" <c:if test="${hotel.payFrom=='01'}">checked="checked"</c:if> />
				<label for="payFrom1">
					线上支付
				</label>
				<input id="payFrom2" type="radio" name="payFrom" value="02" <c:if test="${hotel.payFrom=='02'}">checked="checked"</c:if>/>
				<label for="payFrom2">
					到付
				</label>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td">
				酒店电话:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="phone" type="text" id="phone" value="${hotel.phone}" ltype="text" validate="{required:true,minlength:1,maxlength:50}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				传真:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="fax" type="text" id="fax" value="${hotel.fax}" ltype="text" validate="{required:true,minlength:1,maxlength:50}" />
			</td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td" valign="top">
				最低市场价:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="marketPrice" type="text" id="marketPrice" value="${hotel.marketPrice}" ltype="text" validate="{required:true,number:true}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td" valign="top">
				最低房价:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="minPrice" type="text" id="minPrice" value="${hotel.minPrice}" ltype="text" validate="{required:true,number:true}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td" valign="top">
				是否涉外:
			</td>
			<td align="left" class="l-table-edit-td">
				<input id="priceComHas1" type="radio" name="foreign" <c:if test="${hotel.foreign}">checked="checked"</c:if> value="1" />
				<label for="payFrom1">
					是
				</label>
				<input id="priceComHas2" type="radio" name="foreign" <c:if test="${!hotel.foreign}">checked="checked"</c:if> value="0" />
				<label for="payFrom2">
					否
				</label>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td" valign="top">
				是否可用:
			</td>
			<td align="left" class="l-table-edit-td">
				<input id="needCard1" type="radio" name="enabled" <c:if test="${hotel.enabled}">checked="checked"</c:if> value="1" checked="checked" />
				<label for="payFrom1">
					是
				</label>
				<input id="needCard2" type="radio" name="enabled" <c:if test="${!hotel.enabled}">checked="checked"</c:if> value="0" />
				<label for="payFrom2">
					否
				</label>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td">
				星级:
			</td>
			<td align="left" class="l-table-edit-td">
				<select id="star" name="star">
					<option value="0">不填</option>
					<option value="1">一星级</option>
					<option value="2">二星级</option>
					<option value="3">三星级</option>
					<option value="4">四星级</option>
					<option value="5">五星级</option>
				</select>
				<%-- <input name="star" type="text" id="star" value="${hotel.star}" ltype="text" validate="{required:true,number:true}" /> --%>
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				酒店具体地址:
			</td>
			<td align="left" class="l-table-edit-td">
				<input name="address" type="text" id="address" value="${hotel.address}" ltype="text" validate="{required:true,maxlength:200}" /><span style="color: red;">*</span>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
			<td align="right" class="l-table-edit-td">
				地址:
			</td>
			<td align="left" class="l-table-edit-td">
				<select id="province" name="province" onchange="selectProvince();"></select>
				<select id="city" name="city" onchange="selectCity();"></select>
				<!-- <select id="county" name="county"></select> -->
			</td>
			<td align="left"></td>
			<td align="right" class="l-table-edit-td">
				是否允许点评和评论回复:
			</td>
			<td align="left" class="l-table-edit-td">
				<input id="type1" type="radio" name="discommt" value="01" <c:if test="${hotel.discommt=='01'}">checked="checked"</c:if> />
				<label for="type1">
					允许点评
				</label>
				<input id="type2" type="radio" name="discommt" value="02" <c:if test="${hotel.discommt=='02'}">checked="checked"</c:if>/>
				<label for="type2">
					允许评论回复
				</label>
				<input id="type3" type="radio" name="discommt" value="03" <c:if test="${hotel.discommt=='03'}">checked="checked"</c:if>/>
				<label for="type3">
					都不允许
				</label>
			</td>
			<td align="left"></td>
		</tr>
		<tr>
            <td align="right" class="l-table-edit-td">地图:</td>
            <td align="left" class="l-table-edit-td" colspan="4"> 
            	<input type="hidden" id="lng" name="lng" value="${hotel.lng}"/>
            	<input type="hidden" id="lat" name="lat" value="${hotel.lat}"/>
            	 <img id="map_url"  src="" />
            </td>
            <td align="left"><a href="javascript:;" onclick="mapSetting();">设置</a></td>
            
       </tr>
		<tr>
            <td align="right" class="l-table-edit-td">酒店简介:</td>
            <td align="left" class="l-table-edit-td" colspan="5"> 
            	<textarea cols="100" rows="4" class="l-textarea"  id="desc" name="desc" style="width:600px" validate="{required:true}">${hotel.desc}</textarea>
            </td>
        </tr>
        <tr>
            <td align="right" class="l-table-edit-td">交通信息:</td>
            <td align="left" class="l-table-edit-td" colspan="5"> 
            	<textarea cols="100" rows="4" class="l-textarea"  id="trafficInfo" name="trafficInfo" style="width:600px" validate="{required:true}">${hotel.trafficInfo}</textarea>
            </td>
        </tr>
	</table>
	<br />
	<input type="submit" value="保存" id="Button1" class="l-button l-button-submit" />
	<input type="button" value="取消" class="l-button l-button-test" onclick="javascript:parent.dialog_ae.close();"/>
</form>


<script type="text/javascript">
$(function() {
	
	var toolbars = [['FullScreen','Source','Link','Unlink','Preview','InsertImage','Emotion','Spechars','Bold','Italic',
			'Underline','StrikeThrough','ForeColor','BackColor','JustifyLeft','JustifyCenter','JustifyRight','JustifyJustify',
			'Paragraph','FontFamily','FontSize','ImageNone','ImageLeft','ImageRight','ImageCenter']];
	var initialStyle = 'body{font-family:"宋体";font-size:12px;}';
	var initArgus = {
		toolbars:toolbars,
		wordCount:false,
		minFrameHeight:50,
		initialStyle: initialStyle,
		elementPathEnabled : false
	}
	var trafficInfo_editor = new baidu.editor.ui.Editor({
		toolbars:toolbars,
		wordCount:false,
		minFrameHeight:50,
		initialStyle: initialStyle,
		elementPathEnabled : false,
		textarea:'trafficInfo'
	});
	trafficInfo_editor.render("trafficInfo");
	
	var desc_editor = new baidu.editor.ui.Editor({
		toolbars:toolbars,
		wordCount:false,
		minFrameHeight:50,
		initialStyle: initialStyle,
		elementPathEnabled : false,
		textarea:'desc'
	});
	desc_editor.render("desc");
    
    $.metadata.setType("attr", "validate");
	$("#saveForm").validate({
		 errorPlacement: function (lable, element){
             if (element.hasClass("l-textarea")){
                 element.ligerTip({ content: lable.html(), target: element[0] }); 
             }else if (element.hasClass("l-text-field")){
                 element.parent().ligerTip({ content: lable.html(), target: element[0] });
             }else{
                 lable.appendTo(element.parents("td:first").next("td"));
             }
         },
         success: function (lable){
             lable.ligerHideTip();
             lable.remove();
         },
		submitHandler : function(form) {
        	 $(form).ajaxSubmit({
				dataType : 'text',
				cache : false,
				success : function(data) {
					if(IsNull(data)){
						alert("上传图片失败，请重新上传！");
					}else{
						parent.grid_ae.loadData();
						parent.dialog_ae.close();
					}
					
				},
				error : function(err) {
				//	alert(err);
				}
			});
			return false;
			
			
		}
	});
	provinceChange("province", "city", "county", null,"${hotel.province}","${hotel.city}",null,null);
	$("#star").val(${hotel.star});
	if(!IsNull('${hotel.lng}')){
		var url = "http://api.map.baidu.com/staticimage?center=${hotel.lng},${hotel.lat}&zoom=16&width=420&height=240&markers=${hotel.lng},${hotel.lat}";
		$("#map_url").attr("src",url);
	}
		
});

function uploadImg(self,imagex){
	var filepath = $(self).val();
	var extStart = filepath.lastIndexOf(".");
	var ext = filepath.substring(extStart, filepath.length).toUpperCase();
	if (ext != ".PNG" && ext != ".JPG" && ext != ".JPEG" && ext != ".GIF") {
		alert("图片限于png,jpeg,jpg,gif格式");
		return;
	}
	$("#upload_img_form"+imagex).ajaxSubmit({
		dataType : 'json',
		cache : false,
		success : function(data) {
			$("#image"+imagex).val(data.imageServer+data.imageUrl);
		},
		error : function(err) {
			alert(err);
		}
	});
	return false;
}

function previewImg(imageId){
	var img_url = $("#"+imageId).val();
	if(!IsNull(img_url)){
		window.open(img_url);
	}else{
		alert("没有图片，请上传！");
	}
}

var mapsetDialog;
function mapSetting(){
	mapsetDialog = $.ligerDialog.open({ height: 500,width:600, url: "/thirdparty/ueditor/dialogs/map/mapCoolsk.html", isResize: false ,modal:true,title:'设置地图'});
}
function selectProvince(){
	$("#provinceName").val("");
	var provinceName=$("#province").find("option:selected").text();
	$("#provinceName").val(provinceName);
}

function selectCity(){
	$("#cityName").val("");
	var cityName=$("#city").find("option:selected").text();
	$("#cityName").val(cityName);
}
</script>
